
.index-project{
    width: 750px;
    height: 350px;
    margin: 0 auto;
}
.index-project > .project-box{
    position: relative;

}
.index-project > .project-box > div{
    width: 129px;
    height: 112px;
    float:left; 
    display:table-cell;
    font-size:12px;
    vertical-align:middle;
    text-align:center;
    position: relative;
}
.index-project > .project-box > div > img {
    width: 129px;
    height: 112px;
    display: inline-block;
    transition: .5s;
}
.index-project > .project-box > div > img:hover{
    transform: scale(1.2);
}
.index-project > .project-box > div > span {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.index-project > .project-box > .box2,.box3,.box4,.box6,.box7,.box9,.box10,.box11,.box13,.box14,.box16{
    margin-left: 69px;
}
.index-project > .project-box > .box5,.box12{
    margin-left: 99px;
}
.index-project > .project-box > .box5,.box6,.box7{
    position: relative;
    top: -56px;
}
.index-project > .project-box > .box8,.box9,.box10,.box11{
    position: relative;
    top: -111px;
}
.index-project > .project-box > .box12,.box13,.box14{
    position: relative;
    top: -166px;
}
.index-project > .project-box > .box15{
    margin-left: 198px;
}
.index-project > .project-box > .box15,.box16{
    position: relative;
    top: -221px;
}

